<template>
	<view class="enterprise">
		<view class="nav_bar" style="background-color: rgba(255, 255, 255, 1);">
			<uni-nav-bar color="#333" left-icon="left" title="" :border='false' :fixed="true"
				background-color="transparent" @clickLeft="$util.back()"></uni-nav-bar>
		</view>

		<view class="nav_box"></view>
		
		<view class="auth-content-text">
			<view class="auth-title">商家认证</view>
			<view class="auth-text">完成实名认证后可提升账号安全，享受更多平台权益，如现、发起活动、圈子管理等。</view>
		</view>


		<!-- <view class="block flex_center">
			<view class="block2">
				<view class="title">
					<text>建圈授权书</text>
					<i
						@click="$util.previewImage(['https://qiniu-cdn.maeiyun.com//h5static/auth/preview.png'],0)">查看示例</i>
					<a :href="this.info.create_circle_template" download="建圈申请书.xlsx">下载示例</a>
				</view>

				<view class="image apply_image" @click="onApplyImage">
					<image :src="info.create_circle_file" mode="aspectFill" v-if="info.create_circle_file"></image>
					<image :src="$util.prefix('auth/apply_image.png')" v-else></image>
				</view>
			</view>

			<view style="width: 20rpx;"></view>

			<view class="block2">
				<view class="title flex_center">
					<text>其他补充资质</text>
					<view class="icon" style="padding: 0 6rpx;" @click="onRemark">
						<u-icon name="info-circle-fill" size="32rpx" color="#999"></u-icon>
					</view>
				</view>

				<view class="image apply_image" @click="onOtherCertificate">
					<image :src="info.company_other_certificate" mode="aspectFill"
						v-if="info.company_other_certificate">
					</image>
					<image :src="$util.prefix('auth/apply_image.png')" v-else></image>
				</view>
			</view>
		</view> -->

		<view class="input flex_center">
			<text>法人姓名</text>
			<input type="text" placeholder="请输入" placeholder-class="input-placeholder"
				v-model="info.company_legal_real_name" :disabled="info.company_status == 2" />
		</view>

		<view class="input flex_center">
			<text>法人身份证号</text>
			<input type="text" placeholder="请输入" placeholder-class="input-placeholder"
				v-model="info.company_legal_card_num" maxlength="18" :disabled="info.company_status == 2" />
		</view>

		<view class="input flex_center">
			<text>公司名称</text>
			<input type="text" placeholder="请输入" placeholder-class="input-placeholder" v-model="info.company_legal_name"
				:disabled="info.company_status == 2" />
		</view>

		<view class="input flex_center">
			<text>统一社会信用代码</text>
			<input type="text" placeholder="请输入" placeholder-class="input-placeholder"
				v-model="info.company_legal_id_num" :disabled="info.company_status == 2" />
		</view>
		
		
		<view class="block flex_center">
			<view class="block2">
				<view class="title">法人身份证</view>
				<view class="image business_license_auth_img" @click="onLegalPhoto">
					<image :src="info.company_legal_photo" mode="aspectFill" v-if="info.company_legal_photo"></image>
					<image :src="$util.prefix('auth/auth_apply_new.png')" v-else></image>
				</view>
		
			</view>
		
			<view style="width: 20rpx;"></view>
		
			<view class="block2">
				<view class="title">营业执照上传</view>
				<view class="image business_license_auth_img" @click="onChooseBusiness">
					<image :src="info.company_file_yyzz" mode="aspectFill" v-if="info.company_file_yyzz"></image>
					<image :src="$util.prefix('auth/auth_apply_new.png')" v-else></image>
				</view>
			</view>
		
		
		</view>


		<view class="remark" v-if="info.company_status == 4">
			说明：{{ info.company_reason || '' }}
		</view>

		<view class="btn flex_r_around" @click="onSubmit">
			<text>{{
				info.company_status == 2 ? '已完成'
				: info.company_status == 4 ? '重新提交'
				: '确认'
			}}</text>
		</view>

		<w-compress ref='wCompress' />

		<view>
			<u-modal :show="showmodal" title="提交成功" content='您已提交企业认证，请耐心等待审核' confirmText="我知道了"
				@confirm="back"></u-modal>
		</view>

		<u-notify ref="uNotify"></u-notify>

	</view>
</template>

<script>
	import WCompress from '@/components/w-compress/w-compress.vue';
	export default {
		components: {
			WCompress
		},
		data() {
			return {
				info: {
					// 状态
					company_status: 1,
					// 法人姓名
					company_legal_real_name: '',
					// 公司名称
					company_legal_name: '',
					// 法人身份证号
					company_legal_card_num: '',
					// 统一社会信用代码
					company_legal_id_num: '',
					// 公司营业执照
					company_file_yyzz: '',
					// 建圈申请书
					create_circle_file: '',
					// 公司法人执身份证照
					company_legal_photo: '',
					// 公司其它资格证
					company_other_certificate: '',
					// 建圈模版字段
					create_circle_template: '',
					// 个人身份证姓名
					company_user_real_name: '',
				},

				showmodal: false,
				
				type: '',
			}
		},
		methods: {
			onChooseBusiness() {
				if (this.info.company_status == 2) {
					this.$util.previewImage([this.info.company_file_yyzz]);
				} else {
					// 上传营业执照
					this.$native.authorize('photos');
					uni.chooseImage({
						count: 1,
						sizeType: 'compressed',
						success: (file) => {
							this.$uploadOCR(file.tempFilePaths[0], {
								type: 'picture',
								ocr_type: 2
							}).then(res => {
								if (res.code == 0) {
									this.info.company_file_yyzz = res.data.url;
									this.info.company_legal_real_name = res.data.data.legalPerson;
									this.info.company_legal_name = res.data.data.companyName;
									this.info.company_legal_id_num = res.data.data.creditCode;
								} else {
									this.$util.msg(res.msg);
								}
							})
						},
						fail(err) {
							this.$util.msg(err)
						}
					});
				}
			},

			onLegalPhoto() {
				if (this.info.company_status == 2) {
					this.$util.previewImage([this.info.company_legal_photo]);
				} else {
					// 上传营业执照
					this.$native.authorize('photos');
					uni.chooseImage({
						count: 1,
						sizeType: 'compressed',
						success: (file) => {
							this.$uploadOCR(file.tempFilePaths[0], {
								type: 'picture',
								ocr_type: 1
							}).then(res => {
								if (res.code == 0) {
									this.info.company_legal_photo = res.data.url;
									this.info.company_user_real_name = res.data.data.face.data.name ||
										'';
									this.info.company_legal_card_num = res.data.data.face.data
										.idNumber || '';
								} else {
									this.$util.msg(res.msg);
								}
							})
						},
						fail(err) {
							this.$util.msg(err)
						}
					});
				}
			},

			onApplyImage() {
				if (this.info.company_status == 2) {
					this.$util.previewImage([this.info.create_circle_file]);
				} else {
					this.$native.authorize('photos');
					uni.chooseImage({
						count: 1,
						sizeType: 'compressed',
						success: (file) => {
							this.$refs.wCompress.start(file.tempFilePaths[0], {
								pixels: 2000000, // 最大分辨率，默认二百万
								quality: 0.6, // 压缩质量，默认0.8
								type: 'png', // 图片类型，默认jpg
								// base64: false, // 是否返回base64，默认false，非H5有效
							}).then(url => {
								this.$upload(url, {
									type: 'picture'
								}).then(res => {
									if (res.status == 2 || res.status == 1) {
										this.info.create_circle_file = res.result.url
									} else {
										this.$util.msg(res.msg)
									}
								})
							})

						},
						fail(err) {
							this.$util.msg(err)
						}
					})
				}
			},

			onOtherCertificate() {
				if (this.info.company_status == 2) {
					this.$util.previewImage([this.info.company_other_certificate]);
				} else {
					this.$native.authorize('photos');
					uni.chooseImage({
						count: 1,
						sizeType: 'compressed',
						success: (file) => {
							this.$refs.wCompress.start(file.tempFilePaths[0], {
								pixels: 2000000, // 最大分辨率，默认二百万
								quality: 0.6, // 压缩质量，默认0.8
								type: 'png', // 图片类型，默认jpg
								// base64: false, // 是否返回base64，默认false，非H5有效
							}).then(url => {
								this.$upload(url, {
									type: 'picture'
								}).then(res => {
									if (res.status == 2 || res.status == 1) {
										this.info.company_other_certificate = res.result.url
									} else {
										this.$util.msg(res.msg)
									}
								})
							})

						},
						fail(err) {
							this.$util.msg(err)
						}
					})
				}
			},

			onSubmit() {
				if (this.info.company_status == 2) {
					return;
				}

				if (!this.info.company_legal_name) {
					return this.$util.msg('请填写法人姓名');
				}

				if (!this.info.company_legal_id_num) {
					return this.$util.msg('请填写法人身份证号');
				}

				if (!this.info.company_file_yyzz) {
					return this.$util.msg('请上传公司营业执照');
				}

				if (!this.info.company_legal_photo) {
					return this.$util.msg('请上传公司法人身份证照');
				}

				if (!this.info.company_user_real_name) {
					return this.$util.msg('请上传正确的身份证');
				}
				
				// if(!this.info.company_other_certificate){
				// 	return this.$util.msg('请上传其他补充资质');
				// }
				
				// if(!this.info.create_circle_file){
				// 	return this.$util.msg('请上传建圈授权书');
				// }

				delete this.info.company_status;
				delete this.info.company_reason;
				delete this.info.create_circle_template;

				uni.showLoading();
				this.$post('/circle.circle/submitCompanyAuth', this.info, true, () => {
					uni.hideLoading();
				}).then(res => {
					this.$post('/tencent/getAdvFaceId', {
						name: this.info.company_legal_real_name,
						idNo: this.info.company_legal_card_num,
						auth_type: 2
					}, true, () => {
						uni.hideLoading();
					}).then(res => {
						uni.hideLoading();
						// this.showmodal = true;
						if(this.type == 'store'){
							this.$util.toUrl('/pages/auth/storeAuth')
						}else {
							if (uni.getSystemInfoSync().platform == 'android') {
								this.$native.backAction();
								this.$native.toEnterprise(`${res.data.url}`)
							} else {
								setTimeout(() => {
									window.location.href = res.data.url;
								}, 200)
							}
						}
						
					});
				});
			},

			back() {
				this.showmodal = false;
				this.$native.backAction();
			},

			downLoadFile() {
				this.$native.downLoadFile(this.info.create_circle_template);
			},

			onRemark() {
				this.$util.msg('其他补充材料如商标，icp，许可证等');
			},

		},


		onLoad(option) {
			if (option.data) {
				this.info = JSON.parse(option.data);
			}
			this.type = option.type || '';
		}

	}
</script>

<style lang="less" scoped>
	.enterprise {
		min-height: 100vh;
		background: #FFF;
		padding: 40rpx 32rpx;
	}
	
	.auth-content-text {
		width: 100%;
		.auth-title {
			font-weight: 500;
			font-size: 48rpx;
			color: #FD2A53;
			line-height: 66rpx;
		}
		
		.auth-text {
			font-size: 24rpx;
			color: #999999;
			line-height: 40rpx;
			margin: 24rpx 0 40rpx;
		}
	}

	.input {
		height: 100rpx;
		background: #F8F8F8;
		border-radius: 16rpx;
		overflow: hidden;
		padding: 0 32rpx;
		margin-bottom: 20rpx;

		text {
			font-size: 28rpx;
			color: #333333;
			margin-right: 36rpx;
		}

		input {
			flex: 1;
			text-align: right;
			font-size: 28rpx;
			color: #333;
		}
	}

	.title {
		font-weight: 500;
		font-size: 28rpx;
		color: #131313;
		line-height: 40rpx;
		padding-top: 12rpx;

		text {
			font-weight: 500;
			font-size: 28rpx;
			color: #131313;
		}

		a,
		i {
			color: red;
			font-style: normal;
			font-size: 24rpx;
			padding: 0 16rpx;
			text-decoration: none;
		}
	}

	.block2 {
		flex: 1;
		overflow: hidden;
	}

	.image {
		margin: 32rpx 0 20rpx;
		width: 100%;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.business_license_auth_img {
		width: 320rpx;
		height: 234rpx;
		background: #F7F7F7;
		border-radius: 16rpx;
		border: 2rpx solid #999999;
	}

	.apply_image {
		width: 200rpx;
		height: 200rpx;
	}

	.remark {
		color: #FD2A53;
		font-size: 26rpx;
	}

	.btn {
		width: 686rpx;
		height: 96rpx;
		background: #FD2A53;
		border-radius: 48rpx;
		margin-top: 70rpx;

		text {
			font-weight: 500;
			font-size: 28rpx;
			color: #FFFFFF;
		}
	}
</style>